<template>
  <el-dialog
    :visible.sync="$attrs.visable"
    width="500px"
    :before-close="handleClose"
    append-to-body
    title="消息排序"
    :close-on-click-modal="false"
  >
    <el-form :model="form" ref="ruleForm" label-width="0" class="pl-20">
      <el-form-item label="" prop="type">
        <el-radio-group v-model="form.type" class="flexcolumn">
          <el-radio :label="1" class="flex mb-30">
            <div>
                <div class="fw-5 f-14 c_text2 mb-5">按会话的最新消息</div>
                <div class="f-14 c_text">有消息就会更新排序，适用于人工回复较多的情况</div>
            </div>
          </el-radio>
          <el-radio :label="2" class="flex">
            <div>
                <div class="fw-5 f-14 c_text2 mb-5">按客户发送的最新消息</div>
                <div class="f-14 c_text">只有客户发送的消息会更新排序，适用于己方发送消息量大的情况</div>
            </div>
          </el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button size="small" @click="handleClose">取 消</el-button>
      <el-button size="small" type="primary" @click="handleSubmit"
        >确 定</el-button
      >
    </span>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      form: {
        type: 1,
      },
    };
  },
  methods: {
    handleClose() {
      this.$emit("close"); //关闭弹窗;
    },

    handleAddLable() {
      if (this.form.name) {
        if (this.form.labels.includes(this.form.name)) {
          this.$message.warning("标签重复");
          return;
        }
        this.form.labels.push(this.form.name);
        this.form.name = "";
      }
    },

    removeLable(index) {
      this.form.labels.splice(index, 1);
    },

    handleSubmit() {},
  },
};
</script>
<style lang="scss" scoped>
.labelbox {
  border: 1px solid rgb(240, 240, 240);
  padding: 8px;
}
.labelitem {
  display: inline-block;
  border: 1px solid #d9d9d9;
  background-color: #f5f5f5;
  padding: 4px 13px;
  line-height: 22px;
}
</style>